<nz-card>
  <div class="standard flex">
    <div class="standard-label">所属类目：</div>
    <div class="standard-content hasExpanded flex-1" [class.expanded]="expanded">
      <nz-tag nzMode="checkable" [(nzChecked)]="typeAll" (nzCheckedChange)="typeChangeAll($event)">
        <span>全部</span>
      </nz-tag>
      <ng-container *ngFor="let type of typeList">
        <nz-tag nzMode="checkable" [(nzChecked)]="type.checked" (nzCheckedChange)="typeChange()">
          <span>{{type.name}}</span>
        </nz-tag>
      </ng-container>
    </div>
    <a *ngIf="!expanded" (click)="expanded = true" class="select-trigger">展开<i nz-icon nzType="down"
        nzTheme="outline"></i></a>
    <a *ngIf="expanded" (click)="expanded = false" class="select-trigger">收起<i nz-icon nzType="up"
        nzTheme="outline"></i></a>
  </div>
  <div class="standard flex">
    <div class="standard-label">所属类目：</div>
    <div class="standard-content flex-1">
      <div nz-row [nzGutter]="16">
        <div nz-col [nzXs]="24" [nzSm]="10" [nzLg]="8">
          <nz-form-item>
            <nz-form-label nzFor="author">作者</nz-form-label>
            <nz-form-control>
              <nz-select [(ngModel)]="searchInfo.author" [nzPlaceHolder]="'不限'" class="max-width">
                <nz-option nzValue="1" nzLabel="王昭君"></nz-option>
              </nz-select>
            </nz-form-control>
          </nz-form-item>
        </div>
        <div nz-col [nzXs]="24" [nzSm]="10" [nzLg]="8">
          <nz-form-item>
            <nz-form-label nzFor="author">好评度</nz-form-label>
            <nz-form-control>
              <nz-select [(ngModel)]="searchInfo.like" [nzPlaceHolder]="'不限'" class="max-width">
                <nz-option nzValue="1" nzLabel="优秀"></nz-option>
                <nz-option nzValue="2" nzLabel="普通"></nz-option>
              </nz-select>
            </nz-form-control>
          </nz-form-item>
        </div>
      </div>
    </div>
  </div>
</nz-card>
<div class="mt20">
  <div nz-row [nzGutter]="18">
    <div nz-col [nzXs]="24" [nzSm]="12" [nzMd]="8" [nzLg]="6" *ngFor="let project of projectList">
      <nz-card nzHoverable [nzCover]="coverTemplate" class="mb20">
        <nz-card-meta [nzTitle]="project.title" [nzDescription]="project.desc"></nz-card-meta>
        <div class="cardItemContent flex">
          <span>{{project.time}}</span>
          <div class="cardItemMember">
            <nz-avatar *ngFor="let member of project.memberList" nz-tooltip [nzTooltipTitle]="member.name" nzIcon="user"
              [nzSrc]="member.cover"></nz-avatar>
          </div>
        </div>
      </nz-card>
      <ng-template #coverTemplate>
        <img [alt]="project.title" [src]="project.cover" />
      </ng-template>
    </div>
  </div>
</div>
